<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        body>div{
            width: 1000px;
            margin: 0 auto;
        }
        /*找到两个表示行的div解决所有子元素浮动后高度为0的问题*/
        body>div>div{
            overflow: hidden;
            margin-bottom: 12px;
        }
        #t-l-div{
            width: 611px;
            height: 376px;
            float: left;
        }
        #t-r-div{
            width: 375px;
            height: 376px;
            float: right;
        }
        #t-div>div,#b-l-div,#b-r-div>div{
            background-color: #e8e8e8;
        }

        #b-l-div{/*左下div*/
            width: 366px;
            height: 233px;
            float: left;
        }
        #b-r-div{/*右下div*/
            float: right;
        }
        #b-r-div>div{/*右下3个div*/
            width: 198px;
            height: 233px;
            float: left;
            margin-left: 12px;
        }
    </style>
</head>
<body>

<div>
    <!--上面一行的Div-->
    <div id="t-div">
        <!--上左-->
        <div id="t-l-div"></div>
        <!--上右-->
        <div id="t-r-div"></div>
    </div>
    <!--下一行div-->
    <div id="b-div"></div>
    <!--下左-->
    <div id="b-l-div"></div>
    <!--下右-->
    <div id="b-r-div">
        <div></div>
        <div></div>
        <div></div>
    </div>
</div>

</body>
</html>